import React, { Component } from 'react'
import PropTypes from "prop-types"

export default class ValidationComp extends Component {

    // 先混合属性
    static defaultProps = {
        b: false
    }

    // 再调用相应的函数进行验证
    static propTypes = {
        a: PropTypes.number.isRequired, // a 必须是一个数字类型 isRequired 表示必传
        b: PropTypes.bool.isRequired, // b 必须是一个布尔类型 isRequired 表示必传
        c: PropTypes.node, // c 必须是一个字符串类型
        D: PropTypes.elementType, // d 必须是一个元素类型
        e: PropTypes.instanceOf(Date), // e 必须是一个日期类型
        f: PropTypes.objectOf(PropTypes.number), // f 必须是一个对象类型
        g: PropTypes.arrayOf(PropTypes.string), // g 必须是一个数组类型
        h: PropTypes.shape({
            name: PropTypes.string, // name 必须是一个字符串类型
            age: PropTypes.number, // age 必须是一个数字类型
        }), // h 必须是一个对象类型
        i: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), // i 必须是一个字符串或者数字类型
        j: function (props, propName, componentName) { // j 必须是一个函数类型
            if (props[propName] < 0) {
                return new Error("年龄不能为负数");
            }
        },
        sex: PropTypes.oneOf(["男", "女"]), // sex 必须是男或者女
        children: PropTypes.element, // children 必须是一个元素类型
        onClick: PropTypes.func // onClick 必须是一个函数类型
    }

    render() {
        const { D } = this.props
        return (
            <div>
                a:{this.props.a}
                {this.props.c}
                <D />
            </div>
        )
    }
}
